<template>
  <view class="main-box">
    <view class="my-date">
      <view class="my-date-input"  @click="change">
       
        <view style="margin-right: 32rpx; color: #fff">
          {{ valueTime }}
        </view>
        <u-image
          width="40rpx"
          height="40rpx"
          bgColor="red"
          src="../../../static/images/dateTime.png"
        ></u-image>
      
      </view>
    </view>
    <view class="u-page__item">
      <u-image
        v-if="viewList.length === 0"
        style="margin-top: 120rpx;"
        width="100%"
        height="520rpx"
        src="../../../static/images/nodata.png"
      ></u-image>
      <view class="box my-uni-form" v-else>
        <view v-for="(viewItem, index) in viewList" :key="index">
          <view class="my-title-box">
            <view class="my-title-item-box">
              <view
                style="
                  display: flex;padding-top:10rpx;
                  justify-content: space-between;
                  align-items: center;
                "
              >
                <view class="title">
                  <view
                    style="
                      width: 18rpx;
                      height: 18rpx;
                      background: #2b4fa3;
                      border-radius: 50%;
                    "
                  ></view>
                  <view
                    style="
                      font-weight: bold;
                      color: #1a1a1a;
                      margin-left: 24rpx;
                    ">{{viewItem.dailyDate}}工作日报</view >
                </view>
                <button open-type="share" v-if="viewItem.name"
                  class="callape-btn" style="width:136rpx;height:52rpx"
                  :style="viewItem.isLoading == 2 && { background: '#666' }"
                  @click="shareIndex(viewItem.dailyDate,viewItem.name)" >{{'分享页面'}}
               </button>
            
                <button
                  class="callape-btn" style="width:136rpx;height:52rpx"
                  :style="viewItem.isLoading == 2 && { background: '#666' }"
                  @click="handleSummaryCount(viewItem, index)" >{{viewItem.name?'分享文档':'生成日报'}}
               </button>
              </view>
              
                  <view
                    style="                  
                      margin: 12rpx 0rpx 10rpx 42rpx;
                      font-size: 28rpx;     
                      color: #333;" >
                      <view v-if="viewItem.name" @click="toDetail(viewItem.dailyDate,viewItem.name)" >
                        {{ viewItem.name ||"&nbsp;"  }}
                      </view>
                      <view style="padding:8rpx 0;font-size: 26rpx;color: #666;">{{  viewItem.createTime || "&nbsp;" }}</view>
                </view>
                <!--    <view  v-if="viewItem.id"
                    @click="handleShare(viewItem)" 
                    style="
                      display: flex;
                      align-items: center;
                      color: #2b4fa3;
                      font-size: 22rpx;
                      margin: 10rpx 32rpx; ">
                    <image  class="share" src="../../../static/images/share.png"></image> 分享 
                </view>    -->         
            </view>
          </view>
        </view>
      </view>
    </view>
    <u-datetime-picker
      :show="timeShow"
      @cancel="timeCancel"
      @confirm="timeConfirm"
      v-model="value"
      mode="date"
    ></u-datetime-picker>
  </view>
</template>
<script>
import { getSummaryListData ,setexportData} from '@/service/services.js'
import { mapState } from 'vuex'
import moment from 'moment'
export default {
  data() {
    return {
      path:'',
      valueTime: '请选择时间',
      timeShow: false,
      value: moment(new Date()).format('YYYY-MM-DD'),
      viewList: [], // 保存消息列表
      createDate:'',
      title:''
    }
  },
  computed:{ ...mapState({
      userInfo(item) {
        return item.userInfo
      },
    })
 
   },
  onShow() {
    getSummaryListData().then((res) => {  
      this.viewList =res.data
    })
  },
  mounted() {},
  onLoad() {
    wx.setVisualEffectOnCapture({
      visualEffect: 'hidden',
    })
  },
  methods: {
    //进详情页
    toDetail(date,title){
      uni.navigateTo({
        url: '/pagesA/leader-daily/daily-view-detail/look-detail'+'?createDate='+date+'&title='+title , 
      })
    },
    //分享页面
    shareIndex(val,title){
      this.createDate =val
      this.title =title
    },
    handleShare(item) {
      var URL= 'https://daily.fangliyun.com/prod-api/profile/upload/'+item.path 
      var text = item.name +'.docx'
       wx.downloadFile({
        url:URL ,//'http://video.317hu.com/917b3140-3da6-47d5-911c-a15462fcdeb2.pdf',
        success: res => {          
          var filePath = res.tempFilePath
          wx.shareFileMessage({
            fileName: text,
            filePath:filePath,
            success() {},
            fail: console.error,
          })
        },
      }) 
    }, 
    handleSummaryCount(item, index) {
       if (item.name){
         this. handleShare(item);
         return
       } 
       setexportData({userId:0,createDate:item.dailyDate}).then(res =>{ 
        getSummaryListData({createDate:item.dailyDate}).then((res1) => {this.viewList =res1.data })    
       })
      this.viewList[index].isLoading = 2
    },
    change() {
      this.timeShow = true
    },
    timeCancel() {
      this.timeShow = false
    },
    changeTimeDate(timeData) {
      return moment(timeData).format('YYYY-MM-DD')
    },
    timeConfirm(e) {
      this.valueTime = this.changeTimeDate(e.value)
         getSummaryListData({createDate:this.valueTime}
    ).then((res) => {  
      this.viewList =res.data
    })
      this.timeShow = false
    },
  },
  onShareAppMessage(res) {
        if (res.from === 'button') {
        console.log("来自页面内转发按钮");
        console.log(res.target);
        }
        else {
        console.log("来自右上角转发菜单")
        }
        return {
        title: this.title,
          path: '/pagesA/leader-daily/daily-view-detail/look-detail?createDate='+this.createDate,
          imageUrl: "/static/images/share_img.jpg",
          success: (res) => {
            console.log("转发成功", res);
          },
          fail: (res) => {
            console.log("转发失败", res);
          }
        }
    }
}
</script>

<style lang="scss" scoped>
.u-page__item .box {
  margin-bottom: 32rpx;
}
.u-page__item__title__slot-title {
  height: 80rpx;
  line-height: 80rpx;
}
.u-page__item_daily {
  background: #f8f8f8;
  border: 1rpx solid #d1d7df;
  box-shadow: 0px 2rpx 8rpx 0px #d0d6df;
  border-radius: 1rpx;
  padding: 30rpx;
}
.view_img {
  display: flex;
  flex-wrap: wrap;
  // justify-content: center;
  .view_img_item {
    margin: 10rpx 4px 0rpx 4rpx;
  }
}
.message_icon {
  width: 20rpx;
  height: 20rpx;
  background: #2b4fa3;
  border-radius: 50%;
  display: inline-block;
  margin-right: 22rpx;
}
.u-page {
  padding: 0;

  &__item {
    padding: 0 30rpx;
    &__title {
      background-color: $u-bg-color;
      padding: 15px;
      font-size: 15px;
      &__slot-title {
        font-size: 14px;
      }
    }
  }
}
.imgDetails {
  display: flex;
  flex-wrap: wrap;
}
.u-collapse-content {
  color: $u-tips-color;
  font-size: 14px;
}
.my-date {
  position: relative;
  display: flex;
  padding: 17rpx 30rpx;
  height: 59rpx;
  background: #05163E;
}
.title {
  display: flex;
  align-items: center;
}
.main-box {
  width: 100%;
  display: flex;
  flex-direction: column;
  position: absolute;
  .my-title-box {
    margin: 20rpx 0rpx;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1rpx solid #d6dfec;
  }
  .my-title-item-box {
    color: #606c81;
    width: 100%;
  }
  .textDetails {
    margin: 20rpx 0rpx 32rpx 0rpx;
    height: 24rpx;
    font-size: 24rpx;
    font-weight: 400;
    color: #606c81;
    line-height: 30rpx;
  }
}
.topImg {
  width: 100%;
}
.containerBody {
  position: relative;
  flex: 1;
  margin: -60rpx 24rpx 24rpx 24rpx;
  box-sizing: border-box;
  border: 2rpx solid #ddd;
  z-index: 2;
  border-radius: 20rpx;
  background: #fff;
}
.bottomImg {
  height: 126rpx;
  border-radius: 10rpx;
  position: absolute;
  bottom: -6rpx;
  width: 100%;
}
.share {
  margin-right: 8rpx;
  width: 37rpx;
  height: 32rpx;
}
</style>
